<template>
	<view class="pb50" :class="{bg141414:theme}" style="min-height: 100vh;">
		<!-- <view></view>:style="{paddingTop:shh+'px'}" -->
		<view class="con">
			<view :class="theme?'bg141414 colorfff':'bgf5f6f7'" class="posire posifi  width92vw bgfff" :style="{paddingTop:shh+'px'}">
				<view class="flex-ju-b height50px width92vw bgfff">
					<image @click="back" mode="widthFix" class="image width32" :src="theme?'/static/back.png':'/static/hback.png'"></image>
					<view>藏品订单</view>
					<view class="image width32"></view>
				</view>
				
				<view class="flex-ju-a color999 pb10 size26 bgfff" >
					<view v-for="(item,index) in ['我的订单','寄售订单','委托订单','竞价订单']"
						@click="tapcudex(index)" :class="{cactive:index==current}" >{{item}}
						<view :class="{lactive:index==current}" class="line " style="margin-top: 5px;"></view>
					</view>
				</view>

				<view class="ra15 border999 flex-ju-b bold size26 pg5 bg3C3C3C color999 " >
					<view
						v-for="(item,index) in current==0?['全部','待付款','已完成','已取消']:current==1?['全部','寄售中','已售出','已取消']:current==2?['全部','求购中','已完成']:current==3?['全部','竞价中','已完成']:['全部','转售中','已转售','已取消']"
						@click="tapcuindex(index)" class="height75 flex1 ra15 flex-ju-c" :style="{color:theme&&index==current1?'#fff' :''}" :class="{tactive:index==current1}">{{item}}
					</view>
				</view>
			</view>


			<!-- <view @click="navto('detail')" v-for="(item,s) in list" :key="s" class="bgfff mt30 pg20 ra20"> -->
			<view class="height250" :style="{paddingTop:shh+'px'}"></view>
			<view v-if="isdata" class="flex-ju-c mt8vh">
				<view class="flex-ju-c flex-col">
					<image mode="widthFix" class="width210 ra20" src="/static/nodata.png"></image>
					<view class=" size24">这里什么也没有~</view>
				</view>
			</view>
			<view v-for="(item,s) in list" :key="s"  class=" bgF6F7F8 mt30  pg20 ra20">
				<view class="flex-ju-b color999 border-bE6E6E6 pb20 mb5 mb20 size26">
					<view>订单编号: {{item.no?item.no:item.number}}</view>
					<view v-if="item.status==1" class='colorFC2916 bold size23 flex-a-i'>
						
						{{item.statusValue?item.statusValue:'待付款'}}
						<uni-countdown padding="0" v-if="item.union_status_text == '待付款' && item.auto_closed"
							 :showDay="false" color="#FC2916" splitorColor="#FC2916" :showHour="false"
							:minute="item.minute" :second="item.second">
						</uni-countdown>
					</view>
					
					<view v-else class="size25" :class="{colod:item.union_status_text=='已完成'}">{{item.union_status_text?item.union_status_text:item.statusValue}}
					</view>
				</view>
				
				<view  @click="navto('detail?item=' + JSON.stringify(item))" :class="theme?'bg141414 colorfff':'bgF5F6F7'" class=" ra20  flex">
					<image class="image wh140-140 ra10 mr20" :src="item.thumb"></image>
					<view class="flex1">
						<view class="flex-ju-b size29 ">
							<view class="bold">{{item.title}}</view>
							<view  class="flex-ju-b color999  size26">
								<view v-if="item.total">x{{item.total}}</view>
								<view v-else-if="item.sku_total">x{{item.sku_total}}</view>
								<view v-else>x1</view>
							</view>
						</view>
						<view v-if="item.order_money_price" class=" mt10 size23">¥{{item.order_money_price/100}}
						</view>
						<view v-else class=" mt10 size23">¥{{item.money_price/100}}</view>
						<view class="color999 mt15 size26">
							<view>{{item.created_at}}</view>
						</view>
					</view>
				</view>
				

				<view v-if="item.status==1&&current!=1" class="flex-ju-b color999 mt20 size26 pt30 border-tF5F6F7">
					<view class='colorFC2916 flex-a-i'>
						<!-- 待付款
						<uni-countdown padding="0" v-if="item.union_status_text == '待付款' && item.auto_closed"
							class="mt5" :showDay="false" color="#FC2916" splitorColor="#FC2916" :showHour="false"
							:minute="item.minute" :second="item.second">
						</uni-countdown> -->
					</view>
					<view class="flex-a-i">
						<view @click.stop="tapoff(item,s)" class="border000 wh145-52 color000 ra10 flex-ju-c">取消</view>
						<view v-if="current!=2&&current!=3" @click.stop="tapups(item)" class=" flex-ju-c bg000 colorfff ra10 wh145-52 ml30  ">去支付
						</view>
					</view>
				</view>


				<view v-if="item.status==1&&current==1&&current!=4" class="flex-ju-b color999 mt20 size26 pt30 border-tF5F6F7">
					<view class='colorFC2916'></view>
					<view class="flex-a-i">
						<view @click="taoceng(item,s)" class=" flex-ju-c border000 ra62 wh176-62 ml30 bold color000">
							取消寄售</view>
					</view>
				</view>

				<view v-if="current==2&&item.status!=1" class="flex-ju-b color999 mt20 size26 pt30 border-tF5F6F7">
					<view class='bold color000 width180'>
						<!-- T+1天 16:00后 可取消订单 -->
					</view>
					<view class="flex-a-i">
						<view v-if="item.status==7" @click="tapcentea(item,s)" class="border000 wh145-52 color000 ra10 flex-ju-c">取消</view>
						<!-- <view  @click.stop="navto('mingxi?id='+item.id)"
								class="srgb flex-ju-c  ra62 wh176-62 ml30 bold color000">购买明细</view> -->
					</view>
				</view>
				

				<view v-if="item.status==7&&current==3" class="flex-ju-b color999 mt20 size26 pt30 border-tF5F6F7">
					<view class='colorFC2916'>
						<!-- 待付款 20:33:20 -->
					</view>
					<view class="flex-a-i">
						<view @click="tapstens(item,s)">取消</view>
						<!-- <view @click.stop="tapups(item)"
								class="srgb flex-ju-c ra62 wh176-62 ml30 bold color000">去支付</view> -->
					</view>
				</view>


			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				cencel:false,
				isdata: false,
				theme: uni.getStorageSync('theme'),
				mindex: 0,
				current1: 0,
				current: 0,
				list: [],
				page: 1,
				is_public:''
			} 
		},
		onLoad(option) {
			
			if (option.index) {
				this.current = option.index
			}
			
			if (option.order_id) {
				this.http('order/check?order_id=' + option.order_id).then(res => {
					uni.showToast({
						title: res.data.pay_status,
						icon: "none"
					})
				})
			}

			this.getList()
		},
		onShow() {
			if(this.cencel){
				this.page=1
				this.list=[]
				this.getList()
			}
		},
		onReachBottom() {
			this.page++
			this.getList()
		},
		methods: {
			timedata(res) {
				res.data.list.map(item => {
					if (item.union_status_text == '待付款') {
						console.log("rrrr")
						item.auto_closed = this.istime(item.auto_closed_at)
						var time = (new Date(item.auto_closed_at.replace(/-/g, '/')).getTime() -
							new Date().getTime()) / 1000
						if (time > 0) {
							item.minute = parseInt((time / 60) % 60)
							item.second = parseInt(time % 60)
						}
					}
				})
			},
			getList() {
				if (this.current == 0) {
					let status = 'all'
					if (this.current1 == 0) {
						status = 'all'
					} else if (this.current1 == 1) {
						status = 'pay_pending'
					} else if (this.current1 == 2) {
						status = 'pay_ok'
					} else if (this.current1 == 3) {
						status = 'close'
					}
					this.http('order/list', {
						status,
						page: this.page,
						per_page: 10
					}).then(res => {
						this.timedata(res)
						this.list = [...this.list, ...res.data.list]
						if (this.list.length) {
							this.isdata = false
						} else {
							this.isdata = true
						}
					})
				} else if (this.current == 1||this.current == 4) {
					let status = ''
					if (this.current1 == 0) {
						status = 'all'
					} else if (this.current1 == 1) {
						status = 'pending'
					} else if (this.current1 == 2) {
						status = 'completed'
					} else if (this.current1 == 3) {
						status = 'closed'
					}
					this.http('resale/my_list', {
						status,
						page: this.page,
						per_page: 10,
						is_public:this.current== 4 ? 2:0
					}).then(res => {
						this.list = [...this.list, ...res.data.list]
						if (this.list.length) {
							this.isdata = false
						} else {
							this.isdata = true
						}
					})
				} else if (this.current == 2) {
					let status = ''
					if (this.current1 == 0) {
						status = 'all'
					} else if (this.current1 == 2) {
						status = 'wait_want'
					} else if (this.current1 == 3) {
						status = 'deal'
					}
					this.http('want/orders', {
						status,
						page: this.page,
						per_page: 10
					}).then(res => {
						this.list = [...this.list, ...res.data.list]
						if (this.list.length) {
							this.isdata = false
						} else {
							this.isdata = true
						}
					})
				} else if (this.current == 3) {
					let status = ''
					if (this.current1 == 0) {
						status = 'all'
					} else if (this.current1 == 2) {
						status = 'wait_bidding'
					} else if (this.current1 == 3) {
						status = 'deal'
					}
					this.http('bidding/orders', {
						status,
						page: this.page,
						per_page: 10
					}).then(res => {
						this.list = [...this.list, ...res.data.list]
						if (this.list.length) {
							this.isdata = false
						} else {
							this.isdata = true
						}
					})
				}
			},
			tapcudex(index) {
				this.page = 1
				this.current = index
				this.current1 = 0
				this.list = []
				this.getList()
			},
			tapcuindex(index) {
				this.page = 1
				this.current1 = index
				this.list = []
				this.getList()
			},
			tapups(item) {
				// 需要支付
				// if (this.current == 0) {
				// 	uni.navigateTo({
				// 		url: 'detail?item=' + JSON.stringify(item)
				// 	})
				// } else {
				// 		}
					let url = ''
					url = 'pages/user/order/index'
					// #ifdef APP-PLUS
					url = "back.html?order=1&index=" + this.current
					// #endif

					this.http(`order/payment-config/${item.uuid}`, {
						url
					}, 'post').then(res => {
						this.topay(res.data.pay_url)
					})
				
			},
			taoceng(item, index) {
				uni.showModal({
					title: '提示',
					content: '确定取消寄售吗',
					success: (res) => {
						if (res.confirm) {
							this.http('resale/close/' + item.uuid, {}, 'post').then(res => {
								item.union_status_text = '已关闭'
								item.status = '2'
								uni.showToast({
									title: '取消成功！',
									icon: 'none'
								})
							})
						}
					}
				})
			},
			tapcentea(item) {
				uni.showModal({
					title: '提示',
					content: '确定取消求购吗',
					success: (res) => {
						if (res.confirm) {
							this.http('want/cancel', {
								want_id: item.id
							}, 'post').then(res => {
								item.union_status_text = '已关闭'
								item.status = '2'
								uni.showToast({
									title: '取消成功！',
									icon: 'none'
								})
							})
						}
					}
				})
			},
			tapstens(item) {
				uni.showModal({
					title: '提示',
					content: '确定取消竞价吗',
					success: (res) => {
						if (res.confirm) {
							this.http('bidding/cancel', {
								bidding_id: item.id
							}, 'post').then(res => {
								item.union_status_text = '已关闭'
								item.status = '2'
								uni.showToast({
									title: '取消成功！',
									icon: 'none'
								})
							})
						}
					}
				})
			},
			tapoff(item, index) {
				uni.showModal({
					title: '提示',
					content: '确定取消订单吗',
					success: (res) => {
						if (res.confirm) {
							this.http('order/change/' + item.uuid, {}, 'post').then(res => {
								item.union_status_text = '已关闭'
								item.status = '2'
								uni.showToast({
									title: '取消成功！',
									icon: 'none'
								})
							})
						}
					}
				})
			}
		}
	}
</script>

<style>
	page {
	}

	.line {
		width: 47rpx;
		height: 7rpx;
		margin: auto;
	}
/* 
	.active {
		color: #fff;
		background: #000;
	} */

	.tactive {
		color: #fff;
		background: #000;
	}
	.cactive{
		color: #000;
		font-weight: bold;
	}

	.lactive {
		background: #BBFF8C;
		/* background: linear-gradient(0deg, #FF6E44, #FFA453, #FFDC7F); */
	}
	.colod{
		color: #000;
		font-weight: bold;
	}
</style>